$(() => {
  let $image = $("#image");
  const options = {
    // 纵横比
    aspectRatio: 1,
    // 指定预览区域
    preview: ".img-preview",
  };
  $image.cropper(options);

  $("#btnChooseImage").click(function () {
    $("#file").click();
  });

  $("#file").on("change", function (e) {
    console.log(e);
    const filelist = e.target.files;
    if (filelist.length === 0) {
      return layer.msg("请选择图片");
    }
    // 1. 拿到用户选择的文件
    const fils = e.target.files[0];
    // 2. 将文件，转化为路径
    const imgURL = URL.createObjectURL(fils);

    // 3. 重新初始化裁剪区域
    $image
      .cropper("destroy") // 销毁旧的裁剪区域
      .attr("src", imgURL) // 重新设置图片路径
      .cropper(options); // 重新初始化裁剪区域
  });

  $("#changePc").click(function () {
    var dataURL = $image
      .cropper("getCroppedCanvas", {
        // 创建一个 Canvas 画布
        width: 100,
        height: 100,
      })
      .toDataURL("image/png");

      $.ajax({
        method:'post',
        url:'my/update/avatar',
        data:{
          avatar:dataURL
        },
        success:function(res){
          if(res.status !== 0){
            return layer.msg('更换头像失败')
          }
          layer.msg('更换头像成功')
          window.parent.getUserInfo()
        }
      })
  });
});
